<template>
<!--    <div v-bind="$attrs"  v-on="$listeners">-->
<!--        <list-item></list-item>-->
<!--    </div>-->
    <List
        :border="border"
        :itemLayout="itemLayout"
        :header="header"
        :footer="footer"
        :loading="loading"
        :size="size"
        :split="split">
        <ListItem v-for="(s,index) in getListItem" :key="index">{{s}}</ListItem>
    </List>
</template>

<script>
import {oneOf} from "view-design/src/utils/assist";

export default {
    name: "starListItem",
    data () {
        return {
        };
    },
    props: {
        border: {
            type: Boolean,
            default: false
        },
        itemLayout: {
            validator (value) {
                return oneOf(value, ['horizontal', 'vertical']);
            },
            default: 'horizontal'
        },
        // 或 slot
        header: {
            type: String,
            default: ''
        },
        // 或 slot
        footer: {
            type: String,
            default: ''
        },
        // 含 slot: spin
        loading: {
            type: Boolean,
            default: false
        },
        size: {
            validator (value) {
                return oneOf(value, ['small', 'large', 'default']);
            },
            default () {
                return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
            }
        },
        split: {
            type: Boolean,
            default: true
        },
        itemString:{
            type: String,
            default: ''
        }
    },
    computed: {
        getListItem(){
            if(this.itemString && this.itemString.length >0){
               return  this.itemString.split(",");
            }else{
                return [];
            }
        }

    },
}
</script>

<style scoped>

</style>